SignalR হলো একটি ASP.NET Core লাইব্রেরি যা রিয়েল-টাইম, ডুয়াল-ডিরেকশনাল, এবং ইন্টারেক্টিভ কমিউনিকেশন সক্ষম করে। SignalR ব্যবহার করে আপনি ওয়েব অ্যাপ্লিকেশনগুলোতে রিয়েল-টাইম যোগাযোগ প্রতিষ্ঠা করতে পারেন, যেমন চ্যাট অ্যাপ, লাইভ আপডেট, বা নোটিফিকেশন সিস্টেম। এটি HTTP রিকোয়েস্ট-রেসপন্স মডেলের বাইরে চলে গিয়ে অ্যাপ্লিকেশনের মধ্যে স্ট্রীমিং এবং ইভেন্ট-ভিত্তিক যোগাযোগের সুবিধা প্রদান করে।
SignalR অটোমেটিক্যালি বিভিন্ন ট্রান্সপোর্ট প্রোটোকল (যেমন WebSockets, Server-Sent Events, Long Polling) সিলেক্ট করে, এবং ব্রাউজারের সক্ষমতা অনুযায়ী যথোপযুক্ত পদ্ধতি ব্যবহার করে।
ASP.NET Core SignalR ব্যবহার করে রিয়েল-টাইম অ্যাপ্লিকেশন তৈরি করতে, আপনাকে প্রথমে SignalR হাব (Hub) তৈরি করতে হবে। Hub হল একটি সার্ভার-সাইড ক্লাস যা ক্লায়েন্টদের মধ্যে যোগাযোগ করতে ব্যবহৃত হয়। ক্লায়েন্টরা Hub ক্লাসের মেথড কল করতে পারে এবং সার্ভার Hub মেথডের মাধ্যমে ক্লায়েন্টদের কাছে ডেটা পাঠাতে পারে।
SignalR হাব তৈরি করতে প্রথমে Hub ক্লাস তৈরি করতে হবে, যেখানে আপনি রিয়েল-টাইম মেথডগুলি সংজ্ঞায়িত করবেন।
using Microsoft.AspNetCore.SignalR;
public class ChatHub : Hub
{
public async Task SendMessage(string user, string message)
{
// ক্লায়েন্টদের কাছে বার্তা পাঠানো
await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}
এখানে SendMessage মেথডটি ব্যবহারকারীর কাছ থেকে বার্তা গ্রহণ করে এবং সেটি Clients.All.SendAsync() ব্যবহার করে সকল সংযুক্ত ক্লায়েন্টকে পাঠায়।
SignalR হাব ব্যবহারের জন্য এটি Startup.cs ফাইলে ConfigureServices মেথডে নিবন্ধিত করতে হবে।
public void ConfigureServices(IServiceCollection services)
{
services.AddSignalR(); // SignalR হাব পরিষেবা যোগ করা
}
Startup.cs ফাইলে Configure মেথডে রাউটিং কনফিগার করতে হবে:
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
app.UseRouting();
app.UseEndpoints(endpoints =>
{
endpoints.MapHub<ChatHub>("/chathub");
});
}
এখানে, /chathub হলো SignalR হাবের জন্য ব্যবহার করা URL পাথ।
SignalR হাবের সাথে যোগাযোগ করার জন্য ক্লায়েন্ট সাইডে JavaScript কোড ব্যবহার করা হয়।
আপনার _Layout.cshtml বা নির্দিষ্ট HTML পৃষ্ঠায় SignalR JavaScript লাইব্রেরি যোগ করতে হবে:
<script src="https://cdn.jsdelivr.net/npm/@microsoft/signalr@3.1.6/dist/browser/signalr.min.js"></script>
SignalR হাবের সাথে যোগাযোগ করার জন্য একটি JavaScript ক্লায়েন্ট কোড লিখতে হবে।
const connection = new signalR.HubConnectionBuilder()
.withUrl("/chathub") // হাব URL
.build();
// রিসিভ মেসেজ সেট আপ
connection.on("ReceiveMessage", function (user, message) {
const msg = user + ": " + message;
document.getElementById("messagesList").innerHTML += `<li>${msg}</li>`;
});
// সার্ভারের কাছে মেসেজ পাঠানো
function sendMessage() {
const user = document.getElementById("userInput").value;
const message = document.getElementById("messageInput").value;
connection.invoke("SendMessage", user, message).catch(function (err) {
return console.error(err.toString());
});
}
এখানে, connection.on("ReceiveMessage", ...) মেথডের মাধ্যমে ক্লায়েন্ট রিয়েল-টাইমে বার্তা গ্রহণ করবে এবং connection.invoke("SendMessage", ...) মেথডের মাধ্যমে ক্লায়েন্ট সার্ভারে বার্তা পাঠাবে।
এখন, ক্লায়েন্ট সাইডে SignalR কানেকশন শুরু করতে হবে।
connection.start().catch(function (err) {
return console.error(err.toString());
});
SignalR সাধারণত একক সার্ভারে ব্যবহৃত হয়, কিন্তু অধিক স্কেলেবিলিটির জন্য SignalR Azure SignalR Service ব্যবহার করা যেতে পারে। এটি ক্লাউডে অধিক ক্লায়েন্ট সংযোগ পরিচালনা করতে সহায়তা করে।
{
"ConnectionStrings": {
"AzureSignalRConnectionString": "YourConnectionStringHere"
}
}
public void ConfigureServices(IServiceCollection services)
{
services.AddSignalR().AddAzureSignalR(Configuration.GetConnectionString("AzureSignalRConnectionString"));
}
SignalR অ্যাপ্লিকেশনগুলোতে রিয়েল-টাইম ফিচার যোগ করতে ব্যবহৃত হয়, যেমন:
ASP.NET Core SignalR হল একটি শক্তিশালী লাইব্রেরি যা ডেভেলপারদের রিয়েল-টাইম যোগাযোগ তৈরি করতে সহায়তা করে। এটি ব্যবহার করে সহজেই চ্যাট অ্যাপ্লিকেশন, লাইভ ট্র্যাকিং, নোটিফিকেশন, এবং অন্যান্য রিয়েল-টাইম ফিচার তৈরি করা যেতে পারে। SignalR অত্যন্ত স্কেলেবল এবং সহজে কনফিগারযোগ্য, এবং বিভিন্ন ট্রান্সপোর্ট প্রোটোকলের মাধ্যমে ক্লায়েন্ট এবং সার্ভারের মধ্যে ডেটা আদান প্রদান সক্ষম করে।
SignalR হলো ASP.NET Core-এর একটি লাইব্রেরি যা রিয়েল-টাইম ওয়েব অ্যাপ্লিকেশন তৈরি করার জন্য ব্যবহৃত হয়। এটি ক্লায়েন্ট এবং সার্ভারের মধ্যে রিয়েল-টাইম যোগাযোগের সুবিধা প্রদান করে। SignalR-এর সাহায্যে, ডেটা বা মেসেজ রিয়েল-টাইমে ক্লায়েন্টের কাছে পাঠানো সম্ভব হয়, যার ফলে ক্লায়েন্ট এবং সার্ভারের মধ্যে দ্রুত এবং ইন্টারঅ্যাকটিভ কমিউনিকেশন তৈরি করা যায়।
SignalR খুবই শক্তিশালী এবং বিভিন্ন ধরনের অ্যাপ্লিকেশনে ব্যবহার করা যেতে পারে, যেমন:
SignalR ক্লায়েন্ট এবং সার্ভারের মধ্যে একটি persistent connection তৈরি করে, যা উভয় পক্ষকে ডেটা পাঠানোর বা গ্রহণ করার ক্ষমতা প্রদান করে। সার্ভার যখন কোনো পরিবর্তন ঘটে তখন তা ক্লায়েন্টকে অবহিত করে, এবং ক্লায়েন্ট সেই পরিবর্তন রিয়েল-টাইমে দেখতে পায়। এটি WebSocket, Server-Sent Events (SSE), এবং Long Polling এর মতো প্রযুক্তির উপর ভিত্তি করে কাজ করে। SignalR স্বয়ংক্রিয়ভাবে সর্বোত্তম প্রযুক্তি নির্বাচন করে, যেটি ক্লায়েন্টের ব্রাউজার বা পরিবেশে উপযুক্ত।
SignalR হাব তৈরি করতে, প্রথমে একটি ক্লাস তৈরি করতে হবে যা Hub থেকে ইনহেরিট করবে। এই ক্লাসটি ক্লায়েন্ট এবং সার্ভারের মধ্যে মেসেজ আদান-প্রদানের জন্য ব্যবহৃত হবে।
Hub ক্লাস (C#):
using Microsoft.AspNetCore.SignalR;
public class ChatHub : Hub
{
public async Task SendMessage(string user, string message)
{
await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}
এখানে:
ChatHub হলো একটি SignalR Hub ক্লাস।SendMessage মেথড ব্যবহারকারীদের পাঠানো মেসেজ সবার কাছে পাঠাবে। Clients.All.SendAsync ক্লায়েন্টদের কাছে মেসেজ পাঠানোর জন্য ব্যবহৃত হয়।ReceiveMessage হলো ক্লায়েন্ট সাইডে একটি মেথড যা মেসেজ গ্রহণ করবে।SignalR হাবটি কনফিগার করার জন্য, Startup.cs ফাইলে SignalR সেটআপ করতে হবে।
public void ConfigureServices(IServiceCollection services)
{
services.AddSignalR();
}
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
app.UseRouting();
app.UseEndpoints(endpoints =>
{
endpoints.MapHub<ChatHub>("/chathub");
});
}
এখানে, MapHub মেথড ব্যবহার করে হাবটি সার্ভারে রুট করতে হবে।
SignalR ক্লায়েন্ট সাইডে JavaScript ব্যবহার করে হাবের সাথে সংযুক্ত হতে হয় এবং মেসেজ গ্রহণ করতে হয়।
JavaScript:
const connection = new signalR.HubConnectionBuilder()
.withUrl("/chathub")
.build();
connection.on("ReceiveMessage", function (user, message) {
const msg = user + ": " + message;
document.getElementById("messagesList").innerHTML += "<li>" + msg + "</li>";
});
connection.start().catch(function (err) {
return console.error(err.toString());
});
function sendMessage() {
const user = document.getElementById("userInput").value;
const message = document.getElementById("messageInput").value;
connection.invoke("SendMessage", user, message).catch(function (err) {
return console.error(err.toString());
});
}
এখানে:
signalR.HubConnectionBuilder() ব্যবহার করে SignalR হাবের সাথে সংযোগ তৈরি করা হয়।connection.on মেথড ব্যবহার করে ReceiveMessage নামক ইভেন্টের জন্য একটি হ্যান্ডলার তৈরি করা হয়, যা মেসেজ গ্রহণ করবে।connection.invoke মেথড ব্যবহার করে মেসেজ সার্ভারে পাঠানো হয়।<div>
<input type="text" id="userInput" placeholder="Enter your name" />
<input type="text" id="messageInput" placeholder="Enter your message" />
<button onclick="sendMessage()">Send</button>
</div>
<ul id="messagesList"></ul>
SignalR একটি শক্তিশালী লাইব্রেরি যা ASP.NET Core অ্যাপ্লিকেশনগুলিতে রিয়েল-টাইম যোগাযোগ সহজ করে তোলে। এটি ক্লায়েন্ট এবং সার্ভারের মধ্যে দ্রুত, ইন্টারঅ্যাকটিভ ডেটা আদান-প্রদান করার জন্য ব্যবহার করা হয় এবং এটি ওয়েব অ্যাপ্লিকেশনগুলির মধ্যে একে অপরের সাথে যোগাযোগের অভিজ্ঞতা বৃদ্ধি করে। SignalR এর সাহায্যে ক্লায়েন্টদের সাথে সরাসরি যোগাযোগ করে রিয়েল-টাইম ফিচার যেমন চ্যাট, লাইভ নোটিফিকেশন, এবং স্ট্রিমিং সেবা প্রদান করা যেতে পারে।
SignalR হলো ASP.NET Core এর একটি ফ্রেমওয়ার্ক, যা real-time communication সক্ষম করে। SignalR এর মাধ্যমে সার্ভার এবং ক্লায়েন্টের মধ্যে ডাটা তাৎক্ষণিকভাবে পাঠানো এবং গ্রহণ করা সম্ভব। Hub হলো SignalR এর একটি কেন্দ্রীয় উপাদান, যা ক্লায়েন্ট এবং সার্ভারের মধ্যে যোগাযোগ পরিচালনা করে।
Hub হলো একটি ক্লাস, যা ক্লায়েন্ট এবং সার্ভারের মধ্যে রিমোট পদ্ধতি কল করতে ব্যবহৃত হয়।
প্রথমে SignalR ব্যবহারের জন্য NuGet প্যাকেজ ইনস্টল করতে হবে:
dotnet add package Microsoft.AspNetCore.SignalR
SignalR Hub একটি ক্লাস, যা Hub ক্লাস থেকে ইনহেরিট করে। উদাহরণস্বরূপ, একটি ChatHub ক্লাস:
using Microsoft.AspNetCore.SignalR;
public class ChatHub : Hub
{
public async Task SendMessage(string user, string message)
{
// সকল ক্লায়েন্টকে বার্তা প্রেরণ
await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}
উপরের উদাহরণে:
Hub কার্যকর করতে Program.cs ফাইল আপডেট করুন।
var builder = WebApplication.CreateBuilder(args);
var app = builder.Build();
// SignalR endpoint যুক্ত করা
app.MapHub<ChatHub>("/chathub");
app.Run();
এখানে /chathub হলো SignalR Hub এর URL এন্ডপয়েন্ট।
SignalR ক্লায়েন্ট সাপোর্ট যোগ করার জন্য JavaScript লাইব্রেরি ইনস্টল করুন:
npm install @microsoft/signalr
HTML পেজে SignalR ব্যবহার করতে নিচের কোড লিখুন:
<!DOCTYPE html>
<html>
<head>
<title>SignalR Chat</title>
<script src="https://cdn.jsdelivr.net/npm/@microsoft/signalr@latest/dist/browser/signalr.js"></script>
</head>
<body>
<h1>Chat Room</h1>
<input id="user" type="text" placeholder="Your Name" />
<input id="message" type="text" placeholder="Message" />
<button onclick="sendMessage()">Send</button>
<ul id="messages"></ul>
<script>
// SignalR Hub সংযোগ তৈরি
const connection = new signalR.HubConnectionBuilder()
.withUrl("/chathub")
.build();
// বার্তা গ্রহণ করা
connection.on("ReceiveMessage", (user, message) => {
const li = document.createElement("li");
li.textContent = `${user}: ${message}`;
document.getElementById("messages").appendChild(li);
});
// Hub সংযোগ চালু করা
connection.start().catch(err => console.error(err.toString()));
// বার্তা পাঠানোর ফাংশন
function sendMessage() {
const user = document.getElementById("user").value;
const message = document.getElementById("message").value;
connection.invoke("SendMessage", user, message).catch(err => console.error(err.toString()));
}
</script>
</body>
</html>
dotnet run কমান্ড ব্যবহার করে ASP.NET Core অ্যাপ চালু করুন।https://localhost:5001 URL-টি ওপেন করুন এবং ফর্মটি ব্যবহার করে মেসেজ পাঠান।SignalR Hub তৈরি এবং ব্যবহার ASP.NET Core অ্যাপ্লিকেশনকে আরও ইন্টারেক্টিভ এবং ব্যবহারকারীর জন্য আরও কার্যকর করে তোলে।
ASP.NET Core-এ real-time communication সম্ভব করার জন্য SignalR ব্যবহার করা হয়। SignalR হলো একটি লাইব্রেরি যা real-time web functionality প্রদান করে, যেমন: instant messaging, live updates, notifications, এবং real-time dashboards। SignalR ডেভেলপারদের ক্লায়েন্ট এবং সার্ভারের মধ্যে ডেটা আদান-প্রদান করার জন্য একটি সহজ এবং কার্যকরী পদ্ধতি প্রদান করে।
SignalR এর মাধ্যমে ক্লায়েন্ট সাইডের অ্যাপ্লিকেশন একটি ইভেন্টের মাধ্যমে সার্ভারের কাছ থেকে ডেটা আপডেট পেতে পারে এবং ক্লায়েন্ট সাইডে তা তৎক্ষণাৎ প্রদর্শিত হবে। এটি অ্যাপ্লিকেশনকে real-time data updates এবং live notifications প্রদান করতে সক্ষম করে।
SignalR ব্যবহার করে real-time data updates এবং notifications ইমপ্লিমেন্ট করতে কিছু ধাপ অনুসরণ করতে হবে:
প্রথমে, SignalR সেটআপ করতে হবে। ASP.NET Core অ্যাপ্লিকেশন থেকে SignalR ব্যবহারের জন্য Microsoft.AspNetCore.SignalR NuGet প্যাকেজ ইনস্টল করতে হবে।
NuGet প্যাকেজ ইনস্টল করা:
dotnet add package Microsoft.AspNetCore.SignalR
SignalR এর মাধ্যমে ক্লায়েন্ট এবং সার্ভারের মধ্যে real-time ডেটা পাঠানোর জন্য Hub তৈরি করা হয়। Hub হলো একটি কনসেপ্ট যেখানে ক্লায়েন্ট এবং সার্ভার একে অপরের সাথে যোগাযোগ করতে পারে। Hub ক্লাসে বিভিন্ন মেথড থাকে যেগুলো ক্লায়েন্ট থেকে সার্ভারে কল করা যেতে পারে।
using Microsoft.AspNetCore.SignalR;
public class NotificationHub : Hub
{
// ক্লায়েন্টে মেসেজ পাঠানোর মেথড
public async Task SendMessage(string user, string message)
{
await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}
এখানে, SendMessage মেথডটি ক্লায়েন্ট থেকে সার্ভারে একটি মেসেজ প্রেরণ করবে, এবং ReceiveMessage মেথডটি সব ক্লায়েন্টকে মেসেজ পাঠাবে।
SignalR হাব সার্ভারের সাথে সংযুক্ত করতে Startup.cs ফাইলে কনফিগারেশন করতে হবে।
public class Startup
{
public void ConfigureServices(IServiceCollection services)
{
services.AddSignalR(); // SignalR সার্ভিস যোগ করা
}
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
// SignalR রাউট কনফিগার করা
app.UseEndpoints(endpoints =>
{
endpoints.MapHub<NotificationHub>("/notificationHub");
});
}
}
এখানে, MapHub মেথডটি SignalR হাবকে /notificationHub রুটে ম্যাপ করছে।
SignalR হাবের সাথে ক্লায়েন্ট সাইডে কানেক্ট করতে JavaScript ব্যবহার করতে হবে। ক্লায়েন্ট সাইডে SignalR client library ব্যবহার করা হয় যা SignalR হাবের সাথে কমিউনিকেট করতে সহায়তা করে।
SignalR JavaScript লাইব্রেরি যোগ করা:
আপনি CDN ব্যবহার করে JavaScript লাইব্রেরি যুক্ত করতে পারেন বা NuGet প্যাকেজ ব্যবহার করে সেটি ইনস্টল করতে পারেন। CDN থেকে লাইব্রেরি যোগ করা হয়েছে নিচে:
<script src="https://cdn.jsdelivr.net/npm/@microsoft/signalr@5.0.10/dist/browser/signalr.min.js"></script>
// SignalR হাবের সাথে কানেক্ট করা
const connection = new signalR.HubConnectionBuilder()
.withUrl("/notificationHub")
.build();
// ক্লায়েন্টে মেসেজ রিসিভ করার জন্য হাব মেথড সেট করা
connection.on("ReceiveMessage", function (user, message) {
const msg = `${user}: ${message}`;
const msgElement = document.createElement("div");
msgElement.textContent = msg;
document.getElementById("messagesList").appendChild(msgElement);
});
// কানেক্ট করার পর মেসেজ পাঠানো
document.getElementById("sendButton").addEventListener("click", function () {
const user = document.getElementById("userInput").value;
const message = document.getElementById("messageInput").value;
connection.invoke("SendMessage", user, message).catch(function (err) {
return console.error(err.toString());
});
});
// SignalR connection শুরু করা
connection.start().catch(function (err) {
return console.error(err.toString());
});
এখানে:
ReceiveMessage মেথড ক্লায়েন্ট সাইডে মেসেজ রিসিভ করার জন্য ব্যবহৃত হয়।SendMessage মেথডটি ক্লায়েন্ট থেকে সার্ভারে মেসেজ পাঠানোর জন্য ব্যবহৃত হয়।connection.start() ব্যবহার করে SignalR হাবের সাথে কানেক্ট করা হয়।Real-time notifications প্রেরণ করার জন্য, যখন কোনো ইভেন্ট ঘটে, তখন SendMessage মেথড ব্যবহার করে NotificationHub এর মাধ্যমে ক্লায়েন্টকে মেসেজ পাঠানো হয়।
public class OrderController : Controller
{
private readonly IHubContext<NotificationHub> _hubContext;
public OrderController(IHubContext<NotificationHub> hubContext)
{
_hubContext = hubContext;
}
public async Task<IActionResult> CreateOrder(Order order)
{
// অর্ডার তৈরি করার কোড
// ...
// অর্ডার সফলভাবে তৈরি হলে নোটিফিকেশন পাঠানো
await _hubContext.Clients.All.SendAsync("ReceiveMessage", "System", "New Order Created!");
return RedirectToAction("Index");
}
}
এখানে, IHubContext<NotificationHub> ব্যবহার করে NotificationHub এর মাধ্যমে সব ক্লায়েন্টকে একটি "New Order Created!" নোটিফিকেশন পাঠানো হচ্ছে।
SignalR এর মাধ্যমে ASP.NET Core অ্যাপ্লিকেশনে real-time data updates এবং notifications ইমপ্লিমেন্ট করা খুবই সহজ। SignalR-এ ক্লায়েন্ট এবং সার্ভারের মধ্যে দুই-way communication সম্ভব, যা real-time অ্যাপ্লিকেশন যেমন চ্যাট, লাইভ ড্যাশবোর্ড, নিউজ ফিড, এবং রিয়েল-টাইম নোটিফিকেশন সিস্টেমের জন্য অত্যন্ত কার্যকরী। NotificationHub তৈরি করে ক্লায়েন্টদের সাথে নোটিফিকেশন শেয়ার করা যায় এবং JavaScript ব্যবহার করে SignalR client-side ইন্টিগ্রেট করা যায়।
ASP.NET Core SignalR হলো একটি লাইব্রেরি, যা রিয়েল-টাইম ওয়েব অ্যাপ্লিকেশন তৈরি করার জন্য ব্যবহৃত হয়। SignalR-এর মাধ্যমে সার্ভার এবং ক্লায়েন্টের মধ্যে bidirectional communication সম্ভব হয়।
SignalR-এর ক্লায়েন্ট সাইড ইন্টিগ্রেশনের জন্য JavaScript লাইব্রেরি ব্যবহার করা হয়, যা ক্লায়েন্ট ব্রাউজার এবং সার্ভারের মধ্যে রিয়েল-টাইম যোগাযোগ সক্ষম করে।
SignalR ব্যবহার করার জন্য প্রথমে সার্ভার সাইড সেটআপ করতে হবে।
Startup.cs এ SignalR Middleware যুক্ত করুন:
public void ConfigureServices(IServiceCollection services)
{
services.AddControllersWithViews();
services.AddSignalR();
}
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
app.UseRouting();
app.UseEndpoints(endpoints =>
{
endpoints.MapHub<MyHub>("/myHub");
endpoints.MapDefaultControllerRoute();
});
}
SignalR Hub তৈরি করুন:
using Microsoft.AspNetCore.SignalR;
public class MyHub : Hub
{
public async Task SendMessage(string user, string message)
{
await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}
SignalR ক্লায়েন্ট লাইব্রেরি ডাউনলোড করার জন্য npm বা CDN ব্যবহার করতে পারেন।
npm install @microsoft/signalr
HTML ফাইলে নিচের স্ক্রিপ্ট ট্যাগ যুক্ত করুন:
<script src="https://cdn.jsdelivr.net/npm/@microsoft/signalr@latest/dist/browser/signalr.min.js"></script>
HTML ফাইল:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SignalR Chat</title>
<script src="https://cdn.jsdelivr.net/npm/@microsoft/signalr@latest/dist/browser/signalr.min.js"></script>
</head>
<body>
<div>
<input type="text" id="userInput" placeholder="Your Name" />
<input type="text" id="messageInput" placeholder="Your Message" />
<button id="sendButton">Send</button>
</div>
<ul id="messagesList"></ul>
<script>
// SignalR Hub এর সঙ্গে সংযোগ তৈরি করা
const connection = new signalR.HubConnectionBuilder()
.withUrl("/myHub")
.build();
// সংযোগ শুরু করা
connection.start()
.then(() => {
console.log("Connected to SignalR Hub");
})
.catch(err => console.error(err.toString()));
// সার্ভার থেকে মেসেজ গ্রহণ করা
connection.on("ReceiveMessage", (user, message) => {
const li = document.createElement("li");
li.textContent = `${user}: ${message}`;
document.getElementById("messagesList").appendChild(li);
});
// মেসেজ পাঠানো
document.getElementById("sendButton").addEventListener("click", () => {
const user = document.getElementById("userInput").value;
const message = document.getElementById("messageInput").value;
connection.invoke("SendMessage", user, message)
.catch(err => console.error(err.toString()));
});
</script>
</body>
</html>
HubConnectionBuilder ব্যবহার করে সার্ভারের Hub এর URL এর সঙ্গে সংযোগ স্থাপন করা হয়।connection.start() ব্যবহার করে ক্লায়েন্ট এবং সার্ভারের মধ্যে সংযোগ চালু করা হয়।connection.on মেথড ব্যবহার করে ক্লায়েন্ট সার্ভার থেকে ডেটা গ্রহণ করে। এখানে ReceiveMessage মেথডটি ব্যবহার করা হয়েছে, যা সার্ভারের Hub এ সংজ্ঞায়িত।connection.invoke মেথড ব্যবহার করে ক্লায়েন্ট থেকে সার্ভারে ডেটা পাঠানো হয়।উপরের কোড অনুযায়ী, ক্লায়েন্ট থেকে একটি মেসেজ পাঠানো হলে সার্ভার তা গ্রহণ করে সমস্ত সংযুক্ত ক্লায়েন্টে প্রেরণ করবে।
SignalR JavaScript ইন্টিগ্রেশন ডেভেলপারদের জন্য সহজ এবং শক্তিশালী টুল যা রিয়েল-টাইম অ্যাপ্লিকেশন ডেভেলপমেন্টে নতুন মাত্রা যোগ করে।
common.read_more
common.or
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
